<template>
  <div>
    <el-alert title="拉取相同数据提示'请勿重复操作'，数据未处理完成提示'任务正在处理'" type="warning" effect="light" show-icon closable></el-alert>

    <el-form :model='searchList' ref='searchList' size='normal'>
      <el-row :gutter='20'>
        <el-col :span='4' :offset='0'>
          <el-form-item label=''>
            <el-input v-model='searchList.company_name' placeholder="保障部门" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span='4' :offset='0'>
          <el-form-item label=''>
            <el-input v-model='searchList.project_name' placeholder="项目名称" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span='4' :offset='0'>
          <el-form-item label=''>
            <el-input v-model='searchList.package_name' placeholder="包组名称" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span='6' :offset='0'>
          <el-form-item label=''>
            <el-input v-model='searchList.subject_name' placeholder="标的名称" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span='6' :offset='0'>
          <div class='right'>
            <el-button type='primary' size='medium' @click='search'>查询</el-button>
            <el-button type='primary' size='medium' @click='onAdds' :loading="loading">添加选中行</el-button>
          </div>
        </el-col>
      </el-row>
    </el-form>
    <!-- @selection-change="handleSelectionChange" -->
    <el-table :data='tableData' border stripe :height='offsetHeight' v-loading='loading' ref='tableData' row-key="id"
      @selection-change="handleSelectionChange">
      <el-table-column type='selection' width='50' align='center' :reserve-selection="true">
      </el-table-column>
      <el-table-column type='index' label='序号' width='50' align='center'>
      </el-table-column>
      <el-table-column prop='name' label='保障部门' align='center'>
      </el-table-column>
      <el-table-column prop='project_name' label='项目名称' align='center'>
      </el-table-column>
      <el-table-column prop='package_name' label='包组名称' align='center'>
      </el-table-column>
      <el-table-column prop='subject_name' label='标的名称' align='center'>
      </el-table-column>
      <el-table-column prop='money' label='金额' width="100px" align='center'>
      </el-table-column>
      <el-table-column label='操作' width="80" align='center'>
        <template slot-scope="{row}">
          <el-button type="primary" size="mini" @click="onAdd(row)" :loading="loading">添加</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  name: '',
  components: {},
  props: {
    pullParams: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data () {
    return {
      offsetHeight: document.documentElement.clientHeight - 230,
      loading: false,
      searchList: {},
      tableData: [
      ],
      limitNum: 10,
    }
  },
  created () {
  },
  mounted () {
    this.init()
  },
  methods: {
    async init () {
      this.loading = true
      const res = await this.$http('blockBidList', {
        source: "2",
        ...this.searchList
      })
      this.tableData = res
      this.loading = false
    },
    search () {
      this.$refs.tableData.clearSelection()
      this.init()
    },
    async onAdd (item) {
      this.loading = true
      const res = await this.$http('blockBidAdd', {
        packageId: this.pullParams.id,
        ids: item.id
      })
      if (res.errcode === 9999) {
        this.$tips.warning(res.errmsg)
      } else {
        this.$tips.success(res.errmsg)
      }
      this.loading = false
      this.init()
    },
    async onAdds () {
      this.loading = true
      if (this.$refs.tableData.selection.length === 0) {
        this.$tips.warning('请选择至少一个')
        this.loading = false
        return false
      }
      let ids = []
      this.$refs.tableData.selection.forEach(item => {
        ids.push(item.id)
      })
      this.$refs.tableData.clearSelection();
      const res = await this.$http('blockBidAdd', {
        packageId: this.pullParams.id,
        ids: this.$util.arrToStr(ids)
      })
      if (res.errcode === 9999) {
        this.$tips.warning(res.errmsg)
      } else {
        this.$tips.success(res.errmsg)
      }
      this.loading = false
      this.init()
    },
    // 选择触发
    handleSelectionChange (list) {
      if (list.length > this.limitNum) {
        this.$tips.warning('一次最多选择10个标的')
        this.limitFn(list)
        return
      }
      this.multipleSelectionList = [...list];
    },
    // 限制数量方法
    limitFn (list) {
      this.$refs.tableData.clearSelection();
      for (let i = 0; i < this.limitNum; i++) {
        this.$refs.tableData.toggleRowSelection(list[i]);
      }
    },
    // 判断复选框是否可以选择
    selectable (row) {
      let index = this.multipleSelectionList.findIndex(v => v.id === row.id)
      if (this.multipleSelectionList.length >= this.limitNum) {
        if (index !== -1) {
          return true
        } else {
          return false
        }
      } else {
        return true
      }
    },
  },
  computed: {
  }
}
</script>
<style lang='scss' scoped>
</style>